/* eslint-disable */
<template>
    <div>
        <el-form ref="form" label-width="120px" label-suffix="" :model="form" style="margin-top:30px;">
            <el-form-item required label="كىنو ئىسمى">
                <el-row>
                    <el-col :span="6">
                        <el-input auto-complete="true" v-model="form.title"></el-input>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item required label="تىپى">
                <el-row>
                    <el-col :span="6">
                        <el-select v-model="form.type" placeholder="كىنو تىپىنى تاللاڭ">
                            <el-option v-for="item in typeList" :value="item.value" :label="item.label" :key="item.value"></el-option>
                        </el-select>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item required label="تۈرى">
                <el-row>
                    <el-col :span="6">
                        <el-select v-model="form.sort" placeholder="كىنو تۈرىنى تاللاڭ">
                            <el-option v-for="item in sortList" :value="item.value" :label="item.label" :key="item.value"></el-option>
                        </el-select>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item required label="كىنو ئادىرىسى">
                <el-row>
                    <el-col :span="8" v-if="form.sort==0">
                        <el-input type="textarea" v-model="form.urlList" placeholder="تىياتىرنىڭ ھەر قايسى قىسمىنى پەش بىلەن ئايرىپ يېزىڭ"></el-input>
                    </el-col>
                    <el-col :span="6" v-else>
                        <el-input v-model="form.videoUrl"></el-input>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item label="كىنو رەسىمى">
                <el-upload class="avatar-uploader" action="" :drag="true" :multiple="false" :file-list="images" :http-request="uploadHttp" :before-upload="beforeAvatarUpload" :on-remove="handleRemove" list-type="picture">
                    <i class="el-icon-plus avatar-uploader-icon"></i>
                    <div class="el-upload__tip" slot="tip">رەسىم سىغىمى 500كىلوبايتتىن ئېشىپ كەتسە بولمايدۇ</div>
                </el-upload>
            </el-form-item>
            <el-form-item required label="ھەقلىق كىنو(VIP)">
                <el-row>
                    <el-col :span="6">
                        <el-select v-model="form.isVip" placeholder="كىنو تىپىنى تاللاڭ">
                            <el-option v-for="item in isFreeList" :value="item.value" :label="item.label" :key="item.value"></el-option>
                        </el-select>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item label="باھاسى">
                <el-row>
                    <el-col :span="6">
                        <el-input type="number" v-model="form.price" placeholder="كىنونىڭ باھاسىنى كىرگۈزۈڭ"></el-input>
                    </el-col>
                    <el-col :span="6" :push="1">
                        <span>يۈەن</span>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item required label="يېڭى كىنو">
                <el-row>
                    <el-col :span="6">
                        <el-select v-model="form.isNew" placeholder="كىنو تىپىنى تاللاڭ">
                            <el-option v-for="item in isNewList" :value="item.value" :label="item.label" :key="item.value"></el-option>
                        </el-select>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item>
                <el-button type="submit" @click="submit">چىقىرىش</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
import qs from "qs";
import ossClient from "./ali-oss";
// import moment from 'moment'
export default {
    mounted() {
        this.init();
    },
    data() {
        return {
            moment: moment,
            form: {},
            typeList: [
                { label: "كىنو", value: 0 },
                { label: "قىسىملىق", value: 1 }
            ],
            sortList: [
                { label: "كىنو", value: "MOVIE" },
                { label: "قىسىملىق", value: "TV" },
                { label: "قىسقا فىلىم", value: "SHORT" },
                { label: "كۈلدۈرگە", value: "FUN" },
                { label: "تور فىلىملىرى", value: "NETTV" },
                { label: "سەنئەت", value: "VARIETY" },
                { label: "كارتون", value: "CARTOON" },
                { label: "ئۆزتىل", value: "LOCAL" }
            ],
            isFreeList: [
                { label: "ھەقلىق", value: 1 },
                { label: "ھەقسىز", value: 0 }
            ],
            isNewList: [
                { label: "يېڭى", value: true },
                { label: "كونا", value: false }
            ],
            images: [],
            uploadConf: {
                region: null,
                accessKeyId: null,
                accessKeySecret: null,
                bucket: null,
                stsToken: null
            }
        };
    },
    methods: {
        async init() {
            let aliyun = {
                Region: "oss-cn-beijing", //你的oss地址 ，具体位置见下图
                AccessKeyId: "LTAI6UyguOroHfrG", //你的ak
                AccessKeySecret: "9duOA4ULWG1Fhxuf4vuYccIXcSKZom", //你的secret
                //stsToken: '<Your securityToken(STS)>',//这里我暂时没用，注销掉
                Bucket: "mars-kino" //你的oss名字
            };

            this.uploadConf.region = aliyun.Region;
            this.uploadConf.accessKeyId = aliyun.AccessKeyId;
            this.uploadConf.accessKeySecret = aliyun.AccessKeySecret;
            this.uploadConf.bucket = aliyun.Bucket;
            // this.uploadConf.stsToken = SecurityToken;
        },

        /**
         * 阿里云OSS上传
         */
        uploadHttp({ file }) {
            let self = this;
            let imgName = "MarsVideo";
            const fileName = `${imgName}/${moment().format(
                "YYYYMMDDHHmmssSSS"
            )}`; //定义唯一的文件名
            // console.log(fileName);
            ossClient(this.uploadConf)
                .put(fileName, file, {
                    ContentType: "image/jpeg"
                })
                .then(({ res, url, name }) => {
                    if (res && res.status == 200) {
                        console.log(url);
                        self.form.coverImg = url;
                        /* console.log(
                            `阿里云OSS上传图片成功回调`,
                            res,
                            url,
                            name
                        ); */
                        // ossClient.getObject(fileName)
                    }
                })
                .catch(err => {
                    console.log(`阿里云OSS上传图片失败回调`, err);
                });
        },
        beforeAvatarUpload(file) {
            const isJPEG = file.name.split(".")[1] === "jpeg";
            const isJPG = file.name.split(".")[1] === "jpg";
            const isPNG = file.name.split(".")[1] === "png";
            const isLt500K = file.size / 1024 / 500 < 2;
            if (!isJPG && !isJPEG && !isPNG) {
                this.$message.error("上传图片只能是 JPEG/JPG/PNG 格式!");
            }
            if (!isLt500K) {
                this.$message.error("单张图片大小不能超过 500KB!");
            }
            return (isJPEG || isJPG || isPNG) && isLt500K;
        },

        /**
         * 移除图片
         */
        handleRemove(file, fileList) {
            console.log(`移除图片回调`, fileList);
        },
        async submit() {
            try {
                let res = await this.$http.post(
                    "/uploadVideo",
                    qs.stringify(this.form),
                    {
                        headers: {
                            "Content-Type": "application/x-www-form-urlencoded"
                        }
                    }
                );
                if (res.data.data.msg == "ok") {
                    this.$message.success("مۇۋەپپەقىيەتلىك چىقىرىلدى");
                    setTimeout(() => {
                        this.form = {};
                    }, 300);
                }
            } catch (error) {}
        }
    }
};
</script>

<style lang="scss" scoped>
</style>